<html>
	<head>
		<style type="text/css">
			table{
				
				border:2px solid red;
				border-collapse:collapse;

				font-size:20px;
					
				margin-left:auto;
				margin-right:auto;
				
				
					
			}
			td,th{
				border:2px solid black;
				border-collapse:collapse;
				padding:5px;
				
			}
			td{
				font-weight:bold;

			}

			#fanhui{
				background-color: #0b93d5;
				color: white;
			}
			#queren{
				background-color: #0bd54e;
				color: white;
			}
			
		</style>
	</head>
	<body>

		<h1 style="color: #0b93d5; text-align:center;">订单信息</h1>


			<table>
				<tr>
					<td>房屋位置:</td>
					<td><input id="place" type="text" name="place" readonly="readonly"></td>
				</tr>
				<tr>
					<td>房屋面积:</td>
					<td><input id="area" type="text" name="area" readonly="readonly"></td>
				</tr>
				<tr>
					<td>居&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;室:</td>
					<td><input id="room" type="text" name="room" readonly="readonly"></td>
				</tr>


				<tr>
					<td>起租时间:</td>
					<td><input type="date" id="beginTime" value="" /></td>

				</tr>
				<tr>
					<td>结束时间:</td>
					<td><input type="date" id="stopTime" value="" onchange="zongjine()"/></td>

				</tr>
				<tr>
					<td>单&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;价:</td>
					<td><input id="price" type="text" name="price" readonly="readonly"></td>
				</tr>
				<tr>
					<td>总&nbsp;&nbsp;金&nbsp;&nbsp;额:</td>
					<td><input id="zje" type="text" name="总金额"></td>
				</tr>
				
				
				<tr>

					<td colspan="2" style="text-align:center">

						<button id="fanhui" type="button" >返&nbsp;&nbsp;&nbsp;&nbsp;回</button>
						&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
						<button id="queren" type="submit" >确认租赁</button>
						
					</td>
				</tr>
			</table>
		<script>
			$(function (){
				var data=$("#mainContentId").data("rowData");

				for(let i=0;i<data.length;i++){
					$("#place").val(data[i].place);
					$("#area").val(data[i].area);
					$("#room").val(data[i].room);
					$("#price").val(data[i].price);


				}
			})

			$("#fanhui").on("click",doUpdate)
			$("#queren").on("click",doqueren)

			function zongjine(){


			let a = $("#beginTime").val();
			let bdate = new Date(a);
			let time1 = bdate.getTime();
			//console.log(time1);

			let b = $("#stopTime").val();
			let sdate = new Date(b);
			let time2 = sdate.getTime();
			//console.log(time2);

			let ctain = Math.abs(time2-time1);
			let ztian = Math.ceil(ctain/(1000*3600*24*30));

			let c = $("#price").val();

			$("#zje").val(c*ztian);

			}


			function doqueren(){
				alert('租房成功')
				let url="fyxx-list"
				$("#mainContentId").load(url)
			}

			function doUpdate(){
				let url="fyxx-list"
				$("#mainContentId").load(url)

			}
		</script>
	</body>
</html>
